<template>
	<view>
		<v-form :model="form" ref="uForm" id="form-container">
			<!-- 新增----责任工号 -->
			<view v-for="(item,index) in jobnumberLists" :key="index">
				<u-form-item label="责任工号" :label-width="labelWidth" required>	
					<u-input :key="index" v-model="item.jobnumber" placeholder="请输入责任工号"/>
				</u-form-item>
			</view>
			<u-form-item label-width="80">
				<u-button type="info" size="mini" @click="addjobnumber">新增责任工号</u-button>
			</u-form-item>
			<u-form-item label="产品编码" :label-width="labelWidth" required>
				<u-input v-model="form.technologyNo" :disabled="special" />
			</u-form-item>
			<u-form-item label="产品条码" :label-width="labelWidth" required>
				<u-input v-model="form.deviceBarCode" :disabled="special" />
			</u-form-item>
			<u-form-item label="报检组别" :label-width="labelWidth" prop="InspectionSection" required>
				<u-input v-model="form.InspectionSection" :disabled="special" />
			</u-form-item>
			<u-form-item label="检验员" :label-width="labelWidth" prop="checkJobNumber" required>
				<u-input v-model="form.checkJobNumber" :disabled="special" />
			</u-form-item>
			<u-form-item label="检验数量" :label-width="labelWidth">
				<u-input v-model="form.examineSize" :disabled="special" />
			</u-form-item>
			<u-form-item label="不良数量" :label-width="labelWidth">
				<u-input v-model="form.examineNumber" :disabled="special" />
			</u-form-item>
			
			<u-form-item label="问题小类" class="u-flex u-flex-nowrap" :label-width="200">
				<div class="u-flex u-flex-nowrap u-row-between">
					<u-input v-model="form.issueLittle" />
					<u-button type="success" size="mini" @click="queryIssue('issueLists',index)">查询</u-button>
				</div>
			</u-form-item>
			<u-form-item label="问题大类" :label-width="labelWidth">
				<u-input v-model="form.issueLarge" disabled :placeholder="defaultReminder"/>
			</u-form-item>
			<u-form-item label="问题索引" :label-width="labelWidth">
				<u-input v-model="form.issueIndexes" disabled :placeholder="defaultReminder"/>
			</u-form-item>
			<u-form-item label="责任环节" :label-width="labelWidth">
				<u-input v-model="form.responsibility" disabled :placeholder="defaultReminder"/>
			</u-form-item>
			<u-form-item label="缺陷代码" :label-width="labelWidth">
				<u-input v-model="form.issueId" disabled :placeholder="defaultReminder"/>
			</u-form-item>
			
			<u-form-item label="问题描述" :label-width="labelWidth" prop="disqualificationDesc" required>
				<u-input
				v-model="form.disqualificationDesc" 
				placeholder="请输入改善措施" 
				type="textarea" 
				height="36"
				auto-height="true" 
				adjust-position="true"
				show-confirmbar="false"/>
			</u-form-item>
			<u-form-item label="问题性质" prop="natureId" :label-width="labelWidth" required>
				<u-input v-model="form.natureId" type="select" :select-open="showNature" @click="showNature = true"/>
			</u-form-item>
			<u-form-item label="PTS值" prop="ptsValue" :label-width="labelWidth" required>
				<u-input v-model="form.ptsValue"/>
			</u-form-item>
			<u-form-item label="产线自检" :label-width="labelWidth" required>
				<u-input v-model="form.inspector"/>
			</u-form-item>
			<u-form-item class="u-flex u-row-center">
				<u-button type="success" size="medium" @click="submit">提交</u-button>
			</u-form-item>
		</v-form>
		<u-popup mode="right" v-model="popShow">
			<view class="content">
				<scroll-view scroll-y="true" style="height: 900rpx;width:300rpx">
					<view v-for="(item,index) in issueList" class="buttonGap" :key="index">
						<u-button type="success" size="mini"  @click="selectIssue(item)">{{ item.issueLittle }}——{{ item.issueLarge }}</u-button>
					</view>
				</scroll-view>
			</view>
		</u-popup>
		<u-action-sheet :list="list" v-model="showNature" @click="problemNatureSelect"></u-action-sheet>
		<u-top-tips ref="uTips"></u-top-tips>
	</view>
</template>	
<script>
import { commitDisqualification, issueIndexes } from '../../utils/index.js'
	export default {
		data() {
			return {
				form: {},
				rules: {						//表单提交前的验证
					InspectionSection: [{
						required: true,
						message: '请输入报检组别', 
						trigger: 'blur',
					}],
					checkJobNumber: [{
						required: true,
						message: '请输入检验员', 
						trigger: 'blur',
					}],
					disqualificationDesc: [{
						required: true,
						message: '请输入问题描述', 
						trigger: 'blur',
					}],
					natureId: [{
						required: true,
						message: '请输入问题性质', 
						trigger: 'blur',
					}],
					inspector: [{
						required: true,
						message: '请输入产线自检', 
						trigger: 'blur',
					}]
				},
				defaultReminder: '请输入问题小类进行查询',
				popShow: false,			//弹出层的显示控制条件
				labelWidthType: 160,
				issueList: '',			//输入问题小类返回的与问题小类相关的数组数据
				labelWidth: 140,		//表单每一项的宽度
				list: [					//问题性质的选项
					{
					  text: "一般"
					},
					{
					  text: "轻微"
					},
					{
					  text: "严重"
					},
					{
					  text: "批量"
					}
				],
				issueLists: [],				//多个问题
				isissueLists: false,
				issueIdex: 0,
				jobnumberLists: [],
				showNature: false,
				user: uni.getStorageSync('user'),
			}
		},
		methods:{
			addjobnumber(){
				this.jobnumberLists.push({jobnumber: ''})
			},
			// 表单验证
			submit() {
				if(!this.jobnumberLists.some(item => item.jobnumber)) return this.$refs.uTips.show({
					title: '请输入至少一个责任工号!',
					type: 'warning',
					duration: '2000'
				})
				if(!this.form.technologyNo) return this.$refs.uTips.show({
					title: '产品编码不能为空!',
					type: 'warning',
					duration: '2000'
				})
				if(!this.form.deviceBarCode) return this.$refs.uTips.show({
					title: '产品条码不能为空!',
					type: 'warning',
					duration: '2000'
				})
				if(!this.form.InspectionSection) return this.$refs.uTips.show({
					title: '报检组别不能为空!',
					type: 'warning',
					duration: '2000'
				})
				if(!this.form.checkJobNumber) return this.$refs.uTips.show({
					title: '检验员不能为空!',
					type: 'warning',
					duration: '2000'
				})
				if(!this.form.disqualificationDesc) return this.$refs.uTips.show({
					title: '问题描述不能为空!',
					type: 'warning',
					duration: '2000'
				})
				if(!this.form.inspector) return this.$refs.uTips.show({
					title: '产线自检不能为空!',
					type: 'warning',
					duration: '2000'
				})
				if(!this.form.natureId) return this.$refs.uTips.show({
					title: '请选择问题性质!',
					type: 'warning',
					duration: '2000'
				})
				if(!this.form.ptsValue) return this.$refs.uTips.show({
					title: 'PTS值不能为空!',
					type: 'warning',
					duration: '2000'
				})
				
				// this.$refs.uForm.validate(valid => {
				// 	if (valid) {
				// 		console.log('验证通过')
						this.postForm()
				// 	} else {
				// 		this.$refs.uTips.show({
				// 			title: '请完善表单数据!',
				// 			type: 'warning',
				// 			duration: '2000'
				// 		})
				// 	}
				// })
			},
			// 提交整个表单，提交按钮绑定的函数
			async postForm(val) {
				const query = Object.assign({},this.form)
				// 问题性质的处理
				query.natureId = query.natureId == '一般' ? '1' : query.natureId == '轻微' ? '2' : '3'
				query.jobNumber  = this.jobnumberTostring(this.jobnumberLists)
				query.type = 6
				delete query.otherprocess
				if(this.form.otherprocess) {
					query.next = 'yes'
				} else { query.next = 'no' }
				delete query.issueLarge
				delete query.issueIndexes
				delete query.responsibility
				delete query.issueLittle
				// 发送请求
				const {data} = await commitDisqualification(query)
				if(data.code == 1) {
					this.$refs.uTips.show({
						title: data.msg,
						type: 'success',
						duration: '2000'
					})
					setTimeout(
						uni.redirectTo({
						    url: '../../pages/QC/home/home'
					}), 2000)
				} else {
					this.$refs.uTips.show({
						title:  data.msg,
						type: 'warning',
						duration: '2000'
					})
				}
			},
			// 问题性质选项是数组，传入数组的index值，以此来确定选择了数组的第几项
			problemNatureSelect(index) {
				uni.hideKeyboard();
				this.form.natureId = this.list[index].text
				if(this.form.natureId == '轻微'){
					this.form.ptsValue = '0.125'
				} else if(this.form.natureId == '一般') {
					this.form.ptsValue = '0.25'
				} else if(this.form.natureId == '严重') {
					this.form.ptsValue = '1'
				} else if(this.form.natureId == '批量') {
					this.form.ptsValue = '3'
				}
			},
			// 将问题小类获取的参数填入表单
			selectIssue(value) {
				this.form.issueIndexes = value.issueIndexes
				this.form.issueLarge = value.issueLarge
				this.form.issueId = value.issueId
				this.form.responsibility = value.responsibility
				this.form.issueLittle = value.issueLittle
				
				this.popShow = false
			},
			// 输入问题小类来查找
			async queryIssue(val,index) {
				let query = {
					issueIndexes: this.form.issueLittle
				}
				query.workCenter = this.user.departmentName == '结构总装车间'?'装配车间':this.user.departmentName
				const { data } = await issueIndexes(query)
				this.issueList = data.data
				this.popShow = true
			},
			jobnumberTostring(val){
				let str = []
				val.forEach(item => {
					if(item.jobnumber){str.push(item.jobnumber)}
				})
				return str.join(',')
			},
		},
		// 路由跳转传递过来的参数，表单中没有传递数据进去的参数均为undefined
		onLoad(option) {
			this.form = Object.assign({},option)
			this.form.issueLittle = ''
			this.form.checkJobNumber = uni.getStorageSync('user').userName
			if(this.form.jobNumber){ this.jobnumberLists.push({jobnumber: this.form.jobNumber}) }
			if(this.form.jobNumber2){ this.jobnumberLists.push({jobnumber: this.form.jobNumber2}) }
			if(this.form.jobNumber3){ this.jobnumberLists.push({jobnumber: this.form.jobNumber3})}
			if(!this.form.jobNumber && !this.form.jobNumber2 && !this.form.jobNumber3){ this.jobnumberLists.push({jobnumber: ''}) }
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules)
		}
	}	
</script>

<style lang="scss" scoped>
.main-content {
	width: 100%;
}
#form-container ::v-deep .u-form-item {
	margin-top: 15rpx;
	padding: 10rpx 30rpx;
}
.content {
	padding: 24rpx;
	text-align: center;
}
.buttonGap {
	margin-top: 20rpx;
}
</style>
